class Vue {
    constructor(options) {
        if (options.beforeCreate && typeof options.beforeCreate === "function") {
            options.beforeCreate.bind(this)()
        }
        // 添加$data
        this.$data = options.data
        if (options.created && typeof options.created === "function") {
            options.created.bind(this)()
        }
        if (options.beforeMount && typeof options.beforeMount === "function") {
            options.beforeMount.bind(this)()
        }
        // 添加$el
        this.$el = document.querySelector(options.el)
        if (options.mounted && typeof options.mounted === "function") {
            options.mounted.bind(this)()
        }
        // 模板解析
        this.compiler(this.$el)
    }
    // 解析模板字符串的函数
    compiler(node) {
        node.childNodes.forEach(item => {
            // 元素节点
            if (item.nodeType === 1) {
                this.compiler(item)
            }
            // 文本节点
            if (item.nodeType === 3) {
                let reg = /\{\{(.*)\}\}/g
                item.textContent = item.textContent.replace(reg, (match, key) => {
                    return this.$data[key.trim()]
                })
            }
        })
    }

}